import Vue from 'vue'
import VueRouter from 'vue-router'
import LoginView from '../views/LoginView.vue'
import HomeView from '../views/HomeView.vue'
import IndexView from '../views/IndexView.vue'
import store from '@/store'
import { status } from '@/api/user.js'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    redirect: '/login'
  },
  {
    path: '/login',
    component: LoginView
  },
  {
    path: '/401',
    component: () => import('@/views/401.vue'),
  },
  {
    path: '/home',
    component: HomeView,
    redirect: '/index',
    children: [
      {
        path: '/index',
        component: IndexView,
        meta: {
          title: '管理员首页',
          icon: 's-data',
        }
      },
      {
        path: '/department',
        component: () => import('@/views/department/DepartmentView.vue'),
        meta: {
          title: '系管理',
          icon: 'school',
          permission: '1',
        }
      },
      {
        path: '/major',
        component: () => import('@/views/major/MajorView.vue'),
        meta: {
          title: '专业管理',
          icon: 'document-copy',
          permission: '2',
        }
      },
      {
        path: '/class',
        component: () => import('@/views/class/ClassView.vue'),
        meta: {
          title: '班级管理',
          icon: 'data-board',
          permission: '4',
        }
      },
      {
        path: '/student',
        component: () => import('@/views/student/StudentView.vue'),
        meta: {
          title: '学生管理',
          icon: 'user-solid',
          permission: '8',
        }
      },
      {
        path: '/teacher',
        component: () => import('@/views/teacher/TeacherView.vue'),
        meta: {
          title: '教师管理',
          icon: 's-custom',
          permission: '16',
        }
      },
      {
        path: '/course',
        component: () => import('@/views/course/CourseView.vue'),
        meta: {
          title: '课程管理',
          icon: 'collection',
          permission: '32',
        }
      },
      {
        path: '/studentCourse',
        component: () => import('@/views/studentCourse/StudentCourseView.vue'),
        meta: {
          title: '选课修改',
          icon: 'edit-outline',
          permission: '64',
        }
      },
      {
        path: '/admin',
        component: () => import('@/views/admin/AdminView.vue'),
        meta: {
          title: '管理员管理',
          icon: 's-tools',
          permission: '128',
        }
      }
    ]
  }
]

const router = new VueRouter({
  routes
})

// 路由守卫
router.beforeEach(async (to, from, next) => {
  // to 去哪个页面
  // from 来自那个页面
  // next 函数，放行

  // 已登录
  if (store.state.user.info.loggedIn) {
    if (to.path == '/login') {
      // 登录页，直接跳转到首页
      next('/home')
    } else {
      // 使用接口来检测是否是连接成功
      // 使用异步转同步 async await
      let ret = await status()
      if (ret.data.loggedIn) {
        // 不是登录页，判断用户是否有权限
        if (store.state.user.info.group.indexOf(to.meta.permission) != -1 || !to.meta.permission) {
          // 有相应权限或无需权限，直接放行
          next()
        } else {
          // 无相应权限，跳转至401
          next('/401')
        }
      } else {
        // 连接不成功
        // 清除vuex
        store.commit('user/updateInfo', {})
        next('/login')
      }
    }
  } else {
    // 没有登录
    if (to.path == '/login') {
      // 登录页，放行
      next()
    } else {
      // 不是登录页，去登录页
      next('/login')
    }
  }
})

export default router